<template>
	<view v-if="apiUserInfoMap">
		<view class="header-box">
			<image class="avatar" :src="apiUserInfoMap.base.avatarUrl" mode="aspectFill"></image>
			<view class="r">
				<view class="nick">{{ apiUserInfoMap.base.nick }}</view>
				<view class="uid">用户ID: {{ apiUserInfoMap.base.id }}</view>
			</view>
		</view>
		
		<u-line></u-line>
		<u-gap height="5" bgColor="#EAEBEC"></u-gap>
  
		<u-cell title="申请入驻" isLink clickable url="/pages/person/reg"><u-icon slot="icon" name="plus-circle" color="#e45656" size="42rpx"></u-icon></u-cell>
		<u-cell title="货车管理" isLink clickable url="/pages/card/index"><u-icon slot="icon" name="car" color="#e45656" size="42rpx"></u-icon></u-cell>
		<u-cell title="司机管理" isLink clickable url="/pages/card/index"><u-icon slot="icon" name="man-add" color="#e45656" size="42rpx"></u-icon></u-cell>
		<u-cell title="办证管理" isLink clickable url="/pages/card/index"><u-icon slot="icon" name="coupon" color="#e45656" size="42rpx"></u-icon></u-cell>
		
		<!-- 
		<u-cell title="货车办证" isLink clickable url="/pages/card/card"><u-icon slot="icon" name="car" color="#e45656" size="42rpx"></u-icon></u-cell>
		<u-cell title="帮助中心" isLink clickable url="/pages/help/list"><u-icon slot="icon" name="question-circle" color="#e45656" size="42rpx"></u-icon></u-cell>
		<u-cell title="意见反馈" isLink clickable url="/pages/person/feedback"><u-icon slot="icon" name="email" color="#e45656" size="42rpx"></u-icon></u-cell>
		<u-cell title="用户协议" isLink clickable url="/pages/article/index?key=yhxy"><u-icon slot="icon" name="order" color="#e45656" size="42rpx"></u-icon></u-cell>
		<u-cell title="隐私政策" isLink clickable url="/pages/article/index?key=ysxy"><u-icon slot="icon" name="file-text" color="#e45656" size="42rpx"></u-icon></u-cell>
		 -->
		<u-cell title="客服电话" isLink clickable url="/pages/person/kefu"><u-icon slot="icon" name="kefu-ermai" color="#e45656" size="42rpx"></u-icon></u-cell>
		<u-cell title="关于我们" isLink clickable url="/pages/article/index?key=aboutus"><u-icon slot="icon" name="account" color="#e45656" size="42rpx"></u-icon></u-cell>
		<!-- <u-cell title="清除缓存" isLink clickable @click="clearStorage"></u-cell> -->
		<u-cell title="当前版本" :value="version" clickable @tap="connect"><u-icon slot="icon" name="level" color="#e45656" size="42rpx"></u-icon></u-cell>
		<!-- #ifndef MP-WEIXIN -->
		<view class="btn-block">
			<u-button type="error" text="退出" @click="loginout"></u-button>
		</view>
		<!-- #endif -->
	</view>
	<view v-else-if="needLogin">
		<u-empty mode="permission" text="请先登陆" marginTop="88rpx"></u-empty>
		<view class="submit">
			<u-button type="success" @click="goLogin">立即登陆</u-button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				needLogin: false,
				apiUserInfoMap: undefined,
				balance: 0,
				freeze: 0,
				score: 0,
				growth: 0,
				pic: 'https://uviewui.com/common/logo.png',
				show: true,
				version: getApp().globalData.version,
				cardMyList: undefined
			}
		},
		onLoad() {
			this.version = getApp().globalData.version
		},
		onShow() {
			this._userDetail()
			//this._getUserAmount()
			//this._cardMyList()
		},
		methods: {
			async _userDetail() {
				// https://www.yuque.com/apifm/nu0f75/zgf8pu
				const res = await this.$wxapi.userDetail(this.token)
				if (res.code == 2000) {
					//TODO-
					//this.needLogin = true
					this.apiUserInfoMap={"base":{"avatarUrl":"https://thirdwx.qlogo.cn/mmopen/vi_32/POgEwh4mIHO4nibH0KlMECNjjGxQUq24ZEaGT4poC6icRiccVGKSyXwibcPq4BWmiaIGuG1icwxaQX6grC9VemZoJ8rg/132","birthdayProcessSuccessYear":0,"cardNumber":"2401030053603770001","city":"广州市","dateAdd":"2024-01-03 00:53:53","dateLogin":"2024-01-09 22:13:43","gender":0,"id":14627917,"ipAdd":"14.19.44.10","ipLogin":"14.19.18.119","isFaceCheck":false,"isIdcardCheck":false,"isManager":false,"isSeller":false,"isSendRegisterCoupons":true,"isShopManager":false,"isTeamLeader":false,"isTeamMember":false,"isUserAttendant":false,"levelRenew":false,"mobileVisInvister":true,"nick":"微信用户","province":"广东省","referrerType":0,"secondsAfterRegister":595251,"source":0,"sourceStr":"小程序","status":0,"statusStr":"默认","taskUserLevelSendMonth":0,"taskUserLevelSendPerMonth":false,"taskUserLevelUpgrade":false,"userId":14627917}}
				}
				if (res.code == 0) {
					if (!res.data.base.avatarUrl) {
						res.data.base.avatarUrl = '/static/images/empty.jpg'
					}
					this.apiUserInfoMap = res.data
					this.globalData.userId = res.data.userId
				}
			},
			async _getUserAmount() {
				// https://www.yuque.com/apifm/nu0f75/wrqkcb
				const res = await this.$wxapi.userAmount(this.token)
				if (res.code == 2000) {
					this.needLogin = true
				}
				if (res.code == 0) {
					this.balance = res.data.balance.toFixed(2),
						this.freeze = res.data.freeze.toFixed(2),
						this.score = res.data.score,
						this.growth = res.data.growth
				}
			},
			orderGridClick(status) {
				if (status == 99) {
					uni.navigateTo({
						url: '/pages/order/index?status=' + status
					})
				} else {
					uni.navigateTo({
						url: '/pages/order/index?status=' + status
					})
				}
			},
			go(url) {
				if(url.indexOf('switchTab:') != -1) {
					uni.switchTab({
						url: url.substring(10)
					})
				} else {
					uni.navigateTo({
						url: url
					})
				}
			},
			clearStorage() {
				uni.clearStorageSync()
				uni.showToast({
					title: '已清除'
				})
				uni.reLaunch({
				    url: '../index/index'
				})
			},
			async loginout() {
				// https://www.yuque.com/apifm/nu0f75/mg77aq
				await this.$wxapi.loginout(this.token)
				this.$u.vuex('token', '')
				this.$u.vuex('uid', '')
				uni.reLaunch({
				    url: '../home/index'
				})
			},
			goLogin() {
				// #ifdef MP
				getApp().autoLogin()
				// #endif
				// #ifdef H5
				const ua = window.navigator.userAgent.toLowerCase();
				if (ua.match(/MicroMessenger/i) == 'micromessenger') {
					getApp().autoLogin()
				} else {
					uni.navigateTo({
						url: '/pages/login/login'
					})
				}
				// #endif
				// #ifndef MP || H5
				uni.navigateTo({
					url: '/pages/login/login'
				})
				// #endif
			},
			async _cardMyList() {
				const res = await this.$wxapi.cardMyList(this.token)
				if (res.code == 0) {
					this.cardMyList = res.data
				}
			},
			connect() {//uniapp+mqtt（RabbitMQ）实现消息推送第⼀部分前端篇前端部分使⽤uniapp nvue实现第⼀步：安装mqttnpm安装：npm install mqtt --save第⼆步：编写代码//connect ⽅法在onLoad中调⽤
				var self = this
				const mqtt = require('@/common/mqtt.min.js') //var mqtt = require('mqtt/dist/mqtt.js'); //app端和⼩程序端必须⽤wx://
				var client = mqtt.connect('wx://114.115.223.103:15672/cart', {
					username: "cart",
					password: "cart"
				});
				client.on('connect', function() {
					console.log("已连接");
					client.subscribe( 'cart.order.cancle'/*订阅号，这样才能根据订阅号来推送消息*/ , function(err) {
						console.log("err:" + err) /* if (!err) {client.publish(发布的订阅号, '来⾃王先⽣的消息')}*/
					})
				}).on('reconnect', function() {
					console.log("重连")
				}).on('error', function() {
					console.log("错误")
				}).on('end', function() {
					console.log("断开连接")
				}).on('message', function(topic, message) { //app通知推送
					plus.push.createMessage("您有新消息", "", {
						title: "xxx"
					})
					console.log(message)
				})
			}
			
		}
	}
</script>

<style lang="scss" scoped>
	.header-box {
		padding: 32rpx;
		padding-bottom: 64rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		color: #333;
	}

	.header-box .avatar {
		width: 128rpx;
		height: 128rpx;
		border-radius: 50%;
	}

	.header-box .btn {
		margin-left: 32rpx;
	}

	.header-box .r {
		font-size: 28rpx;
		display: flex;
		  flex-direction: column;
		  justify-content: center;
		  align-items:center;
		.nick {
			margin-top: 20rpx;
		}
		.uid {
			margin-top: 10rpx;
		}
	}
	.container {
		min-height: 100%;
		overflow: hidden;
		overflow-y: hidden;
	}

	.asset {
		width: 100vw;
		display: flex;
		border-top: 1px solid #eee;
		padding-top: 20rpx;
		padding-bottom: 20rpx;
	}

	.asset .item {
		flex: 1;
		display: flex;
		flex-direction: column;
		text-align: center;
		font-size: 24rpx;
		line-height: 20px;
		color: #666;
	}

	.asset .item .amount {
		color: #333;
		font-size: 32rpx;
		padding-bottom: 12rpx;
	}

	.asset .right {
		border-left: 1px solid #eee;
	}

	.version {
		width: 100vw;
		font-size: 24rpx;
		text-align: center;
		padding: 32rpx;
	}

	.to-authorize {
		padding: 0rpx;
		margin: 0rpx;
		background: none;
		border: none;
		height: auto;
		line-height: auto;
	}

	/* 绑定手机号 */
	.bind-phone-number {
		margin: 20rpx;
		width: 100%;
	}

	/* flex重新构建菜单 */
	.menu-item {
		width: 100vw;
		height: 104rpx;
		padding: 0 32rpx;
		background: #fff;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.menu-item .l {
		font-size: 34rpx;
		color: #333;
		line-height: 104rpx;
	}

	.menu-item .r {
		font-size: 32rpx;
		color: #999;
		line-height: 104rpx;
	}

	.menu-item .next {
		width: 40rpx;
		height: 40rpx;
	}

	.menu-item button {
		margin: 0;
	}

	.space {
		width: 100vw;
		height: 2rpx;
		background: #F4F5F9;
	}

	.line {
		width: 718px;
		height: 1px;
		background: #EEEEEE;
		margin-left: 32rpx;
	}


	.login-box .logo {
		width: 200rpx;
		margin: 64rpx 275rpx;
	}

	.login-box .line {
		height: 2rpx;
		width: 686rpx;
		background-color: #ebedf0;
		margin: 0 32rpx;
	}

	.login-box .title {
		margin: 64rpx 0 0 32rpx;
		color: #333;
		font-size: 36rpx;
	}

	.login-box .profile {
		margin: 32rpx 0 0 32rpx;
		color: #999;
		font-size: 28rpx;
	}

	.login-box .btn {
		margin: 88rpx 32rpx;
	}

	.grid_item {
		padding: 24rpx 0;
		text-align: center;
		display: flex;
		flex-direction: column;
		align-items: center;

		.txt {
			margin-top: 16rpx;
			font-size: 26rpx;
			color: #333;
		}
	}
	.btn-block {
		padding: 32rpx;
	}
	.submit {
		padding: 32rpx;
	}
</style>
